<template>
  <el-tabs v-model="activeName" @tab-click="handleClick">
    <template v-for="(item, index) in tabList">
      <el-tab-pane
        :key="index"
        :label="item.name"
        :name="item.name"
      >
      </el-tab-pane>
    </template>
  </el-tabs>
</template>

<script>
export default {
  data () {
    return {
      activeName: ''
    }
  },
  computed: {
    tabList: function () {
      // 去重
      return this.$store.getters.tabList.filter((currentValue, index) => this.$store.getters.tabList.indexOf(currentValue) === index)
    }
  },
  methods: {
    handleClick (tab) {
      this.activeName = tab.name
      this.$emit('tab-click', tab.name)
    }
  }
}
</script>
